/* 
    Document   : main
    Created on : 27/10/2010, 04:17:17 PM
    Author     : Jacobo Martínez
    Description:
        CSS for the backoffice app of EMCMS.
    The first part of this style sheet are the contents of 3 files (reset.css,
    typography.css and form.css) included in Blueprint CSS Framework 0.9
    Copyright (c) 2007-Present. For more information about Blueprint go to:
        http://blueprintcss.org
*/

/* 
    reset.css
*/
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote,
pre, a, abbr, acronym, address, code, del, dfn, em, img, q, dl, dt, dd, ol, ul,
li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th,
td, article, aside, dialog, figure, footer, header, hgroup, nav, section {
    margin:0;
    padding:0;
    border:0;
    font-weight:inherit;
    font-style:inherit;
    font-size:100%;
    font-family:inherit;
    vertical-align:baseline;
}
article, aside, dialog, figure, footer, header, hgroup, nav, section {
    display:block;
}
body {line-height:1.5;}
table {border-collapse:separate;border-spacing:0;}
caption, th, td {text-align:left;font-weight:normal;}
table, td, th {vertical-align:middle;}
blockquote:before, blockquote:after, q:before, q:after {content:"";}
blockquote, q {quotes:"" "";}
a img {border:none;}

/*
    typography.css
*/
html {font-size:100.01%;}
body {font-size:75%;color:#222;background:#fff;font-family:"Helvetica Neue", Arial, Helvetica, sans-serif;}
h1, h2, h3, h4, h5, h6 {font-weight:normal;} /*Originally the color property was set to this color:#111; removed for convinience*/
h1 {font-size:3em;line-height:1;margin-bottom:0.5em;}
h2 {font-size:2em;margin-bottom:0.75em;}
h3 {font-size:1.5em;line-height:1;margin-bottom:1em;}
h4 {font-size:1.2em;line-height:1.25;margin-bottom:1.25em;}
h5 {font-size:1em;font-weight:bold;margin-bottom:1.5em;}
h6 {font-size:1em;font-weight:bold;}
h1 img, h2 img, h3 img, h4 img, h5 img, h6 img {margin:0;}
p {margin:0 0 1.5em;}
p img.left {float:left;margin:1.5em 1.5em 1.5em 0;padding:0;}
p img.right {float:right;margin:1.5em 0 1.5em 1.5em;}
a:focus, a:hover {color:darkblue;}
a {color:#009;text-decoration:none;} /*Originally the text-decoration property was set to this text-decoration:underline removed for convinience*/
blockquote {margin:1.5em;color:#666;font-style:italic;}
strong {font-weight:bold;}
em, dfn {font-style:italic;}
dfn {font-weight:bold;}
sup, sub {line-height:0;}
abbr, acronym {border-bottom:1px dotted #666;}
address {margin:0 0 1.5em;font-style:italic;}
del {color:#666;}
pre {margin:1.5em 0;white-space:pre;}
pre, code, tt {font:1em 'andale mono', 'lucida console', monospace;line-height:1.5;}
li ul, li ol {margin:0;}
ul, ol {margin:0 1.5em 1.5em 0;padding-left:3.333em;}
ul {list-style-type:disc;}
ol {list-style-type:decimal;}
dl {margin:0 0 1.5em 0;}
dl dt {font-weight:bold;}
dd {margin-left:1.5em;}
table {margin-bottom:1.4em;width:100%;}
th {font-weight:bold;}
thead th {background:#c3d9ff;}
th, td, caption {padding:4px 10px 4px 5px;}
.even {background:#e5ecf9;} /*Originally the rule was tr.even td, div.even {background:#e5ecf9;} modified for convinience*/
tfoot {font-style:italic;}
caption {background:#eee;}
.small {font-size:.8em;margin-bottom:1.875em;line-height:1.875em;}
.large {font-size:1.2em;line-height:2.5em;margin-bottom:1.25em;}
.hide {display:none;}
.quiet {color:#666;}
.loud {color:#000;}
.highlight {background:#ff0;}
.added {background:#060;color:#fff;}
.removed {background:#900;color:#fff;}
.first {margin-left:0;padding-left:0;}
.last {margin-right:0;padding-right:0;}
.top {margin-top:0;padding-top:0;}
.bottom {margin-bottom:0;padding-bottom:0;}

/*
    forms.css
*/
label {font-weight:bold;}
fieldset {padding:1.4em;margin:0 0 1.5em 0;border:1px solid #ccc;}
legend {font-weight:bold;font-size:1.2em;}
input[type=text], input[type=password], input.text, input.title, textarea, select {background-color:#fff;border:1px solid #bbb;}
input[type=text]:focus, input[type=password]:focus, input.text:focus, input.title:focus, textarea:focus, select:focus {border-color:#666;}
input[type=text], input[type=password], input.text, input.title, textarea, select {margin:0.5em 0;}
input.text, input.title {width:300px;padding:5px;}
input.title {font-size:1.5em;}
textarea {width:390px;height:250px;padding:5px;}
input[type=checkbox], input[type=radio], input.checkbox, input.radio {position:relative;top:.25em;}
form.inline {line-height:3;}
form.inline p {margin-bottom:0;}
.error, .notice, .success {padding:.5em;margin-bottom:.1em;border:2px solid #ddd;}
.error {background:#FBE3E4;color:#FF0000;border-color:#FF0000;}
.notice {background:#FFF6BF;color:#514721;border-color:#FFD324;}
.success {background:#E6EFC2;color:#264409;border-color:#C6D880;}
.error a {color:#8a1f11;}
.notice a {color:#514721;}
.success a {color:#264409;}

/*
    this is the end of the Blueprint included definitions
*/

/**
    This are modifications for overwrite the rules declared in /css/redmond/jquery.ui.button.css
*/
.ui-button-text-icon-primary .ui-button-text, .ui-button-text-icons .ui-button-text{
    padding: 0em 0.6em 0em 1.7em;
}
input.ui-button {
    padding: 0.05em 0.5em;
}
.ui-button-icons-only .ui-button-text, .ui-button-icon-only .ui-button-text {
  padding: 0em;
  text-indent: -1e+7px;
}
#form_buttons .ui-button {
    margin-right: 10px;
}
form .ui-button-text-only .ui-button-text {
    padding: 0.04em 0.5em;
}
tfoot .ui-button-text {
    font-style: normal;
}
.ui-button-icons-only {
  width: 2.5em;
}
.ui-button-icons-only .ui-button-icon-primary {
  left: 0.15em;
}
.ui-button-icons-only .ui-button-icon-secondary {
  right: 0.15em;
}
.pagination .ui-button-text-only .ui-button-text {
  padding: 0.1em 0.25em;
}

/**
    End of the modifications
*/
#container {
    width: 1200px;
    margin-top: 2em;
    margin-left: 10em;
    text-align: center;
    position: relative;
}
#header {
    height: 4em;
    width: inherit;
}
#header #header-title{
    float:left;
    margin-bottom: 0;
    margin-top: 0.5em;
    margin-left: 3em;
}
#header-title h2{
    margin: 0;
}
#header #header-logout{
    float: right;
    margin-right: 1em;
    vertical-align: middle
}
#content {
    height: 39em;
    width: inherit;
    margin: 1em 0;
    text-align: left;
}

#content a:focus, #content a:hover {
    text-decoration: underline;
}
#content #component_left, #content #component_right {
    height: 37em;
    width: 43.3em;
    margin: 1em;
    float: left;
    position: relative;
}
#content #component_right {
    overflow: auto;
}
#component_left #buttons {
    
}
#footer {
    height: 3em;
    padding: 0.5em 0;
    width: inherit;
    bottom: auto
}
#footer p{
    margin-bottom: 0;
}

#portal_list{
    height: 34em;
    margin-bottom: 1em;
    padding-bottom: 0.2em;
}

#portal_list #portal_list_header {
    height: 2em
}

#portal_list_body{
    height: 32em;
    overflow: auto
}

.portal_list_row {
    width: 100%;
    float: left;
    margin-top: 0.3em;
    vertical-align: middle
}

.portal_list_column {
    width: 8.5em;
    float: left;
    margin-right: 0.2em;
    margin-top: 0.2em;
    text-align: center;
}

.portal_list_column span, .portal_list_column a {
    height: 16px;
    width: 16px;
}

.portal_list_column_last{
    margin-right: 0;
    width: 7em;
}

#content_editor {
    height: 45em;
    width: 89em;
    margin: 1em;
}

#content_editor #tree {
    height: 37em;
    width: 20em;
    margin-right: 1em;
    float: left;
}

#tree #tree_header{
    width: auto;
}
#tree #tree_content{
    width: auto;
    height: 30.5em;
    margin-top: 0.5em;
    overflow: auto;
    position: relative;
}

#tree_content #tree_structure{
    margin-left: 0.5em;
    margin-top: 0.5em;
}

#tree #treecontrols{
    margin: 0.5em;
}

#treecontrols a {
    margin-right: 0.5em;
}

#return_button{
    margin-top: 1em;
}

#content_editor #elements {
    height: 24em;
    width: 9em;
    margin-right: 1em;
    float: left;
}

#elements #elements_header {
    width: auto;
}

#elements #elements_content {
    margin-top: 0.5em;
    width: auto;
    height: 20em;
}

#content_editor #main {
    float: left;
    height: 37em;
    width: 57.7em;
}

#main #main_header{
    width: auto;
}

#main #main_content{
    width: auto;
    height: 33em;
    margin-top: 0.5em;
    overflow: auto;
}

#main_content table {
    margin: 0;
    padding: 1.5em 4em;
}
#main_content table tfoot tr td{
    text-align: center;
    padding-top: 1.5em;
}
#main_content span.mceEditor table {
    padding: 0;
}
#main_content span.mceEditor table tfoot tr td{
    text-align: left;
    padding-top: 0;
}

/**
    Estilo para los encabezados de las columnas
*/
.ui-widget-header h3{
    margin-top: 0.5em;
    margin-bottom: 0.5em;
    text-align: center;
}

/**
    Boton para crear un portal.
*/
#crearportal {
    margin-left: 1em;
}
#crearportal a {
    height: 24px;
    width: 100px;
    display: block;
    background: no-repeat url(/images/util/botones/crearPortal1.gif);
}

#crearportal a:hover {
    background-image: url(/images/util/botones/crearPortal2.gif);
}

/*
    Clase para las viñetas de los menúes del
    árbol de estructura del portal.
*/
.menu-bullet{
    float: left;
}

/**
    Estilo de los botones
*/
.button {
    padding: 0.4em 1em 0.4em 20px;
    margin: 4px 2px 0px 2px;
    position: relative;
    text-decoration: none;
}

.button .ui-icon {
    left: 0.2em;
    margin: -8px 5px 0 0;
    position: absolute;
    top: 50%;
}

/**
    En esta sección de la hoja de estilos se trabaja lo referente a los formularios

    Contenedor de los formularios
*/
.form {
    padding: 1.5em;
}
.form h2{
    margin-bottom: 0;
}
.form fieldset {
  margin: 0;
  padding: 1.5em;
}
#main_content .form fieldset {
  padding: 1.5em;
}
#main_content .form fieldset fieldset{
  padding: 1em;
}
#main_content .form fieldset fieldset.first{
  margin-top: 3em;
}
#main_content .form fieldset fieldset .form-row{
  padding-top: 1em;
}
#main_content .form fieldset.first {
  margin-top: 1.5em;
}
/**
*   Estilo de cada fila de un formulario
*/
.form .form-row{
    clear: both;
    height: auto;
    width: auto;
    padding-top: 1em;
}
.form-row.first-row {
    padding-top: 0;
}
.form .form-row label {
    float: left;
    height: inherit;
    margin-right: 1em;
    width: 15em;
}
.form-row .form-field ul li label {
    width: auto
}
.form .form-row .form-field {
    float: left;
    height: auto;
}

.form .form-row .form-field .error {
    padding: 2px;
    text-align: center;
}
.form fieldset .error_list{
    margin-top: 2.5em;
}
.form fieldset .form-row .error_list{
    margin-top: 0;
    margin-bottom: 0.5em;
}
.form .form-row .form-field p {
    padding-top: 0.5em;
    margin: 0 0 .5em;
}
#main_content .form .form-row table {
    padding: 0;
    margin-bottom: 0.5em;
}
.upload-files-table{
    background: lightblue;
    margin-bottom: 0.5em;
}

fieldset .form-row {
    padding-top: 0;
}
/**
    Botones de los formularios
*/
#form_buttons{
    display: block;
    position: relative;
    text-align: center;
    margin-top: 1em;
}
.add-button {
    margin-top: 1em;
}
.form .form-row .form-help{
    float: left;
    margin-left: 16em;
    margin-top: 0.2em;
}
.form .form-row .form-field .form-help{
    float: none;
    margin-left: 0em;
}
.form-help em {
    color: red;
    font-style: normal;
    font-size: 0.8em;
}

/**
    Estilo para los Radio Buttons de los formularios
*/
ul.radio_list {
    margin: 0;
    padding: 0;
}

ul.radio_list li {
    float: left;
    list-style: none outside none;
    margin-right: 5px;
    position: relative;
    vertical-align: top
}

ul.radio_list li label{
    width: auto;
    margin-top: 0;
    margin-right: 5px;
}
ul.radio_list li input, .form-field input[type="checkbox"] {
    top: 0;
    margin: 0;
    margin-top: 3px;
}
.form-field input[type="text"], .form-field input[type="password"], .form-field input.text,
.form-field input.title, .form-field textarea, .form-field select {
    margin: 0;
}

.form-field textarea {
  height: 6em;
  width: 30em;
  padding: 0.5em;
}

/*
    Para el formulario de inicio de sesión
*/
.signin_form{
    width: 20%;
    position: absolute;
    top: 32%;
    left: 38%;
    text-align: center;
    padding: 2%;
}
.show {
    padding: 1.5em;
}

/*
    Clase para el div del cargador ajax
*/
.ajax-loader {
    text-align: center;
    width: 100%;
    height: 100%;
}
.ajax-loader-tree img {
    margin-top: 75%;
}
.ajax-loader-main img {
    margin-top: 35%;
}
.ajax-loader-component-right img {
    margin-top: 40%;
}